<template>
  <div class="storage">
    <el-card class="!border-none" shadow="never">
      <el-alert
        type="warning"
        title="温馨提示：1.切换存储方式后，需要将资源文件传输至新的存储端；2.请勿随意切换存储方式，可能导致图片无法查看"
        :closable="false"
        show-icon
      ></el-alert>
    </el-card>
    <el-card style="margin-top: 15px;" shadow="never" v-loading="loading">
      <el-table size="large" :data="lists">
        <el-table-column label="储存方式" prop="name" min-width="120" />
        <el-table-column label="储存位置" prop="path" min-width="160" />
        <el-table-column label="状态" min-width="80">
          <template #default="{ row }">
            <el-tag v-if="row.status == 1">开启</el-tag>
            <el-tag type="danger" v-else>关闭</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="操作" min-width="80" fixed="right">
          <template #default="{ row }">
            <el-button
              v-perms="['setting.storage/setup']"
              type="primary"
              link
              @click="handleSet(row.engine)"
            >
              设置
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-card>
    <edit-popup ref="editRef" @success="getLists" />
  </div>
</template>
<script>
import api from '@/app/admin/api'
import editPopup from './edit.vue'
export default {
  components: {
    editPopup
  },
  data() {
    return {
        loading:false,
        lists:[],
    };
  },
  created: function () {
    this.getList();
  },
  methods:{
    async getList(){
        const res = await api.storage.list();
        this.lists = res.data;
    },
    handleSet(engine){
        this.$refs.editRef.open(engine)
    }
  }
};
</script>
